<!--
 * @Author: 陈俊升 761723995@qq.com
 * @Date: 2023-08-16 10:13:13
 * @LastEditors: 陈俊升 761723995@qq.com
 * @LastEditTime: 2023-10-30 08:55:03
 * @FilePath: /hr_new_vue3/src/views/Management/Attendance/AttendanceManagement/PunchingMode/Applet/index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<!-- 考勤-基础设置-小程序打卡 -->
<template>
  <div class="wrap">
    <a-collapse :bordered="false" style="margin-top: 10px">
      <a-collapse-item header="使用指南" key="1">
        <template #header>
          <span style="font-size: 24px">使用指南</span>
        </template>
        <a-list :bordered="false" :split="false" size="small">
          <a-list-item v-for="(item, index) in listArr" :key="index"
            >{{ item }}
          </a-list-item>
        </a-list>
      </a-collapse-item>
    </a-collapse>
    <div>
      <a-tabs lazy-load default-active-key="1">
        <a-tab-pane key="1" title="打卡地址"><Address /> </a-tab-pane>
        <a-tab-pane key="2" title="打卡WIFI"><Wifi /> </a-tab-pane>
      </a-tabs>
    </div>
  </div>
</template>

<script lang="ts" setup>
import Address from './Components/Address/index.vue';
import Wifi from './Components/Wifi/index.vue';

const listArr = [
  `设置打卡地址、打卡WiFi后，请在【考勤分组】→【考勤组管理】中关联员工及其适用的打卡方式`
];
</script>

<style lang="less" scoped>
:deep(.arco-collapse-item-content) {
  background-color: #fff;
}
</style>
